<div class="root">
    <div class="income">
        <image resize="cover" class="income-bg" :src="incomeBg"></image>

        <div class="income-box">
            <div class="income-row">
                <text class="income-row-txt font-msyhl">账户余额（元）</text>
                <text class="income-row-money font-msyhl">{{incomeMoney | currency('¥')}}</text>
            </div>

            <div class="income-row" @click="goToFreeze">
                <div class="income-row-more">
                    <text class="income-row-txt font-msyhl">冻结余额（元）</text>
                    <image v-if="freezeMoney > 0" resize="contain" class="freeze-money-icon" :src="freezeMoneyIcon"></image>
                </div>

                <text class="income-row-money font-msyhl">{{freezeMoney | currency('¥')}}</text>
            </div>
        </div>
    </div>

    <div class="list-head">
        <text class="l-h-txt font-msyhl">收支明细</text>
    </div>

    <!--表头-->
    <div class="list-table" v-if="listLoaded && incomeList.length">
        <text class="list-table-txt flex-item-left font-msyhl">时间</text>
        <text class="list-table-txt flex-item-center font-msyhl">金额</text>
        <text class="list-table-txt flex-item-center font-msyhl">操作</text>
        <text class="list-table-txt flex-item-right font-msyhl">备注</text>
    </div>

    <list ref="list" class="list" loadmoreoffset="15" offset-accuracy="30" @loadmore="fetchMore" @scroll="onScroll">
        <cell class="list-item" append="tree" v-for="(income,index) in incomeList" :ref="'cell_' + index">
            <div class="list-item-content" @click="goToDetail(income)">
                <text class="list-item-txt flex-item-left font-msyhl">{{income.time}}</text>
                <text class="list-item-txt flex-item-center font-msyhl">{{income.money | currency('¥')}}</text>
                <text class="list-item-txt flex-item-center font-msyhl">{{income.type}}</text>

                <div class="flex-item-right list-item-remark">
                    <text class="list-item-txt list-item-remark-txt font-msyhl">{{income.remark}}</text>
                    <image resize="cover" class="list-item-more" :src="listMoreIcon"></image>
                </div>
            </div>
        </cell>

        <!--加载提示-->
        <loading-more-tip v-if="!listCompleted && incomeList.length" :loading="loading"></loading-more-tip>

        <cell v-if="listCompleted && incomeList.length">
            <loaded-over-tip :tip="'没有更多数据了 ~'"></loaded-over-tip>
        </cell>

        <cell class="empty-cell" v-if="listLoaded && !incomeList.length">
            <content-empty :emptyTxt="'暂无数据 ~'"></content-empty>
        </cell>
    </list>

    <!--一键置顶-->
    <go-top :showGoTop="showGoTop" :refEl="refEl"></go-top>
</div>